body {
  font-family: "microsoft yahei ui","microsoft yahei","Work Sans", Arial, sans_serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.7;
  color: #828282;
  background: #fff;
}

.dhl{
  width: 100%;
  height: 770px;
  background-color: #828282;
}

.clearfix:after {
  content: "";
  display: block;
  clear: both;
}
  
*:before, *:after {
  -webkit-box-sizing: border_box;
  -moz-box-sizing: border_box;
  box-sizing: border_box;
}


.common {
  width: 1170px;
  margin: 0 auto;
  padding: 0 15px;
  position: relative;
}


/* #region 导航 start */
header {
  position: absolute;
  z-index: 9;
  width: 100%;
  background-color: transparent;
}

nav {
  width: 1170px;
  height: 107px;
  margin-top: 39px;
  padding: 0 15px;
}

header h1 {
  float: left;
}

header h1 img {
  margin-top: 10px;
  width: 160px;
  height: 48px;
}

.nav_right {
  width: 933px;
  height: 48px;
  float: right;
  margin-top: 10px;
  padding: 0 15px;
}

.nav_right ul {
  margin-left: 261px;
}

.nav_right ul li {
  float: left;
  margin-right: 24px;
  padding-top: 5px;
}

.nav_right ul li:nth-child(8) {
  margin-right: 0px !important;
}

.nav_right ul li a {
  text-transform: uppercase;
  letter-spacing: 2px;
  display: block;
  line-height: 20px;
  height: 20px;
  padding: 10px 6px;
  color: #fff;
  font-weight: 500;
  font-size: 16px;
  transition: all 0.5s;
}

.nav_right ul li a:hover {
  color: #202122;
}

.nav_right .nav_zc {
  padding: 12px 30px !important;
  color: #22d7bb;
  background-color: transparent;
  border: 2px solid #22d7bb;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 1px;
  display: inline-block;
  border-radius: 35px;
  text-transform: uppercase;
  margin-top: -5px;
}

.nav_right .nav_zc:hover {
  background-color: #fff;
  color: #22d7bb;
  border: 2px solid #fff;

}

.nav_right .nav_dr {
  padding: 12px 30px !important;
  color: #fff;
  background: #22d7bb;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 1px;
  display: inline-block;
  border-radius: 35px;
  text-transform: uppercase;
  margin-top: -5px;
}

.nav_right .nav_dr:hover {
  background-color: #fff;
  color: #22d7bb;
}

.ih {
  width: 100%;
  height: 500px;
  background-color: red;
}

/* #endregion 导航 end  */

/* #region banner start */
.banner {
  position: relative;
  background: url('../images/ryy/banner-case.jpg') no-repeat 0px 0px;
  width: 100%;
  background-size: cover;
  min-height: 570px;
}

.container {
  margin: 0 auto;
  padding: 0 15px;
}

.agile_banner_info {
  padding: 13em 0em 0em;
}

/* 自动打字 */
.agile_banner_info1 {
  margin-bottom: 20px;
  margin-left: 0em;
  height: 80px;
}

.agile_banner_info1 span {
  font-size: 3.5em;
  color: #fff;
  text-transform: capitalize;
  font-weight: 600;
}

.agile_banner_info1 span i {
  font-style: normal;
  color: #3ed7b5;
  font-weight: 600;
}

.typed-cursor {
  font-family: "microsoft yahei ui", "microsoft yahei", "Work Sans", Arial, sans-serif !important;
  font-weight: 400 !important;
  font-size: 16px !important;
  line-height: 1.7 !important;
  color: #7f8281 !important;
}

.banner_agile_para {
  margin-right: 10em;
  margin-bottom: 80px;
}

.banner_agile_para p {
  color: #fff;
  margin: 9px 0;
  line-height: 2em;
  letter-spacing: 2px;
  font-size: 16px;
}

/* 搜索 */
.agileinfo {
  margin: 1em 0 0;
  position: relative;
  width: 600px;
}

.agileinfo form {
  display: block;
  margin-top: 0em;
}

.agileinfo input[type="button"] {
  outline: none;
  padding: 16px 0;
  width: 22%;
  background: #22d7bb;
  border: none;
  font-size: 15px;
  letter-spacing: 1px;
  color: #fff;
  border-radius: 35px;
  box-sizing: border-box;
  position: absolute;
  top: -38px;
  font-family: "microsoft yahei ui", "microsoft yahei", "Work Sans", Arial, sans-serif;
  cursor: pointer;
}

.agileinfo input[type="button"]:hover {
  background: #fd5c63;
  color: #fff;
}

/* #endregion  banner end  */

/* #region 中间正文 start */
.middle_main{
  width: 100%;
  height: 864px;
  /* background-color: #5a4b64; */
}

/* 版心 */
.connect {
  width: 1170px;
  height: 704px;
  margin-right: auto;
  margin-left: auto;
  padding-left: 15px;
  padding-right: 15px;
  /* background-color: yellowgreen; */
}

/* 标题 */
.fh5co_heading {
  margin-bottom: 5em;
  margin-left: 16.66667%;
  width: 66.66667%;
}

.text_center {
  text-align: center;
}

.fh5co_heading h2 {
  font-size: 36px;
  margin-bottom: 20px;
  line-height: 1.5;
  font-weight: bold;
  color: #000;
  font-weight: bold;
  margin: 0 0 20px 0;
}

.fh5co_heading p {
  font-size: 20px;
  line-height: 1.5;
  color: #828282;
}

p {
  margin-bottom: 20px;
  margin: 0 0 10px;
}

/* 图标文字 */
.row {
  margin-left: _15px;
  margin-right: _15px;
}

.col_md_2 {
  width: 195px;
  height: 100px;
  float: left;
}

.logo_0_2_132 {
  filter: grayscale(100%) sepia(10%) opacity(0.5);
  display: flex;
  padding: 15px 7px;
  transition: filter .3s ease_in_out, opacity .3s ease_in_out, false-shadow .3s ease_in_out, background_color .3s ease_in_out;
  align-items: center;
  justify-content: center;
}

.logo_0_2_132 img {
  width: 170px;
}

/* 延迟效果 */
/*自定义一个透明度从0到1的动画，它的名称是fade-in*/
@keyframes fade-in{  
  0%{ opacity: 0;}
  100%{opacity:1;}
}

.connect{ 
  /*实先规定文字的状态是不显示的*/
  opacity: 0;
  /*调用名称为fade-in的动画，全程动画显示时间7s，进入方式为ease，延时0S进入，播放次数1次*/
  animation: fade-in 7s ease 0s 1;
  -webkit-animation: fade-in 7s ease 0s 1;
  -moz-animation: fade-in 7s ease 0s 1;
  -o-animation: fade-in 7s ease 0s 1;
  -ms-animation: fade-in 7s ease 0s 1;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.one{ 
   /*实先规定文字的状态是不显示的*/
  opacity: 0;     
  /*调用名称为fade-in的动画，全程动画显示时间7s，进入方式为ease，延时0S进入，播放次数1次*/
  animation: fade-in 7s ease 0s;    
  -webkit-animation: fade-in 7s ease 0s;
  -moz-animation: fade-in 7s ease 0s;
  -o-animation: fade-in 7s ease 0s;
  -ms-animation: fade-in 7s ease 0s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.two{ 
  /*实先规定文字的状态是不显示的*/
 opacity: 0;     
 /*调用名称为fade-in的动画，全程动画显示时间7s，进入方式为ease，延时0S进入，播放次数1次*/
 opacity: 0;    
 animation: fade-in 7s ease 0.2s;
 -webkit-animation: fade-in 7s ease 0.2s;
 -moz-animation: fade-in 7s ease 0.2s;
 -o-animation: fade-in 7s ease 0.2s;
 -ms-animation: fade-in 7s ease 0.2s;
 
 /*规定动画的最后状态为结束状态*/
 animation-fill-mode:forwards;
 -webkit-animation-fill-mode: forwards;  
   -o-animation-fill-mode: forwards; 
   -ms-animation-fill-mode: forwards;   
   -moz-animation-fill-mode: forwards; 
}

.three{ 
  opacity: 0;    
  animation: fade-in 7s ease 0.4s;
  -webkit-animation: fade-in 7s ease 0.4s;
  -moz-animation: fade-in 7s ease 0.4s;
  -o-animation: fade-in 7s ease 0.4s;
  -ms-animation: fade-in 7s ease 0.4s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.four{ 
  opacity: 0;    
  animation: fade-in 7s ease 0.6s;
  -webkit-animation: fade-in 7s ease 0.6s;
  -moz-animation: fade-in 7s ease 0.6s;
  -o-animation: fade-in 7s ease 0.6s;
  -ms-animation: fade-in 7s ease 0.6s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.five{ 
  opacity: 0;    
  animation: fade-in 7s ease 0.8s;
  -webkit-animation: fade-in 7s ease 0.8s;
  -moz-animation: fade-in 7s ease 0.8s;
  -o-animation: fade-in 7s ease 0.8s;
  -ms-animation: fade-in 7s ease 0.8s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.six{ 
  opacity: 0;    
  animation: fade-in 7s ease 1s;
  -webkit-animation: fade-in 7s ease 1s;
  -moz-animation: fade-in 7s ease 1s;
  -o-animation: fade-in 7s ease 1s;
  -ms-animation: fade-in 7s ease 1s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.seven{ 
  opacity: 0;    
  animation: fade-in 7s ease 1.2s;
  -webkit-animation: fade-in 7s ease 1.2s;
  -moz-animation: fade-in 7s ease 1.2s;
  -o-animation: fade-in 7s ease 1.2s;
  -ms-animation: fade-in 7s ease 1.2s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.eight{ 
  opacity: 0;    
  animation: fade-in 7s ease 1.4s;
  -webkit-animation: fade-in 7s ease 1.4s;
  -moz-animation: fade-in 7s ease 1.4s;
  -o-animation: fade-in 7s ease 1.4s;
  -ms-animation: fade-in 7s ease 1.4s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.nine{ 
  opacity: 0;    
  animation: fade-in 7s ease 1.6s;
  -webkit-animation: fade-in 7s ease 1.6s;
  -moz-animation: fade-in 7s ease 1.6s;
  -o-animation: fade-in 7s ease 1.6s;
  -ms-animation: fade-in 7s ease 1.6s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.ten{ 
  opacity: 0;    
  animation: fade-in 7s ease 1.8s;
  -webkit-animation: fade-in 7s ease 1.8s;
  -moz-animation: fade-in 7s ease 1.8s;
  -o-animation: fade-in 7s ease 1.8s;
  -ms-animation: fade-in 7s ease 1.8s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.eleven{ 
  opacity: 0;    
  animation: fade-in 7s ease 2s;
  -webkit-animation: fade-in 7s ease 2s;
  -moz-animation: fade-in 7s ease 2s;
  -o-animation: fade-in 7s ease 2s;
  -ms-animation: fade-in 7s ease 2s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.twelve{ 
  opacity: 0;    
  animation: fade-in 7s ease 2.2s;
  -webkit-animation: fade-in 7s ease 2.2s;
  -moz-animation: fade-in 7s ease 2.2s;
  -o-animation: fade-in 7s ease 2.2s;
  -ms-animation: fade-in 7s ease 2.2s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.thirteen{ 
  opacity: 0;    
  animation: fade-in 7s ease 2.4s;
  -webkit-animation: fade-in 7s ease 2.4s;
  -moz-animation: fade-in 7s ease 2.4s;
  -o-animation: fade-in 7s ease 2.4s;
  -ms-animation: fade-in 7s ease 2.4s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.fourteen{ 
  opacity: 0;    
  animation: fade-in 7s ease 2.6s;
  -webkit-animation: fade-in 7s ease 2.6s;
  -moz-animation: fade-in 7s ease 2.6s;
  -o-animation: fade-in 7s ease 2.6s;
  -ms-animation: fade-in 7s ease 2.6s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.fifteen{ 
  opacity: 0;    
  animation: fade-in 7s ease 2.8s;
  -webkit-animation: fade-in 7s ease 2.8s;
  -moz-animation: fade-in 7s ease 2.8s;
  -o-animation: fade-in 7s ease 2.8s;
  -ms-animation: fade-in 7s ease 2.8s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.sixteen{ 
  opacity: 0;    
  animation: fade-in 7s ease 3s;
  -webkit-animation: fade-in 7s ease 3s;
  -moz-animation: fade-in 7s ease 3s;
  -o-animation: fade-in 7s ease 3s;
  -ms-animation: fade-in 7s ease 3s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.seventeen{ 
  opacity: 0;    
  animation: fade-in 7s ease 3.2s;
  -webkit-animation: fade-in 7s ease 3.2s;
  -moz-animation: fade-in 7s ease 3.2s;
  -o-animation: fade-in 7s ease 3.2s;
  -ms-animation: fade-in 7s ease 3.2s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.eighteen{ 
  opacity: 0;    
  animation: fade-in 7s ease 3.4s;
  -webkit-animation: fade-in 7s ease 3.4s;
  -moz-animation: fade-in 7s ease 3.4s;
  -o-animation: fade-in 7s ease 3.4s;
  -ms-animation: fade-in 7s ease 3.4s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.nineteen{ 
  opacity: 0;    
  animation: fade-in 7s ease 3.4s;
  -webkit-animation: fade-in 7s ease 3.4s;
  -moz-animation: fade-in 7s ease 3.4s;
  -o-animation: fade-in 7s ease 3.4s;
  -ms-animation: fade-in 7s ease 3.4s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.twenty{ 
  opacity: 0;    
  animation: fade-in 7s ease 3.6s;
  -webkit-animation: fade-in 7s ease 3.6s;
  -moz-animation: fade-in 7s ease 3.6s;
  -o-animation: fade-in 7s ease 3.6s;
  -ms-animation: fade-in 7s ease 3.6s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.twenty_one{ 
  opacity: 0;    
  animation: fade-in 7s ease 3.8s;
  -webkit-animation: fade-in 7s ease 3.8s;
  -moz-animation: fade-in 7s ease 3.8s;
  -o-animation: fade-in 7s ease 3.8s;
  -ms-animation: fade-in 7s ease 3.8s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.twenty_two{ 
  opacity: 0;    
  animation: fade-in 7s ease 4s;
  -webkit-animation: fade-in 7s ease 4s;
  -moz-animation: fade-in 7s ease 4s;
  -o-animation: fade-in 7s ease 4s;
  -ms-animation: fade-in 7s ease 4s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.twenty_three{ 
  opacity: 0;    
  animation: fade-in 7s ease 4.2s;
  -webkit-animation: fade-in 7s ease 4.2s;
  -moz-animation: fade-in 7s ease 4.2s;
  -o-animation: fade-in 7s ease 4.2s;
  -ms-animation: fade-in 7s ease 4.2s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.twenty_four{ 
  opacity: 0;    
  animation: fade-in 7s ease 4.4s;
  -webkit-animation: fade-in 7s ease 4.4s;
  -moz-animation: fade-in 7s ease 4.4s;
  -o-animation: fade-in 7s ease 4.4s;
  -ms-animation: fade-in 7s ease 4.4s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.twenty_five{ 
  opacity: 0;    
  animation: fade-in 7s ease 4.6s;
  -webkit-animation: fade-in 7s ease 4.6s;
  -moz-animation: fade-in 7s ease 4.6s;
  -o-animation: fade-in 7s ease 4.6s;
  -ms-animation: fade-in 7s ease 4.6s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.twenty_six{ 
  opacity: 0;    
  animation: fade-in 7s ease 4.8s;
  -webkit-animation: fade-in 7s ease 4.8s;
  -moz-animation: fade-in 7s ease 4.8s;
  -o-animation: fade-in 7s ease 4.8s;
  -ms-animation: fade-in 7s ease 4.8s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.twenty_seven{ 
  opacity: 0;    
  animation: fade-in 7s ease 5s;
  -webkit-animation: fade-in 7s ease 5s;
  -moz-animation: fade-in 7s ease 5s;
  -o-animation: fade-in 7s ease 5s;
  -ms-animation: fade-in 7s ease 5s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.twenty_eight{ 
  opacity: 0;    
  animation: fade-in 7s ease 5.2s;
  -webkit-animation: fade-in 7s ease 5.2s;
  -moz-animation: fade-in 7s ease 5.2s;
  -o-animation: fade-in 7s ease 5.2s;
  -ms-animation: fade-in 7s ease 5.2s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.twenty_nine{ 
  opacity: 0;    
  animation: fade-in 7s ease 5.4s;
  -webkit-animation: fade-in 7s ease 5.4s;
  -moz-animation: fade-in 7s ease 5.4s;
  -o-animation: fade-in 7s ease 5.4s;
  -ms-animation: fade-in 7s ease 5.4s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}

.thirty{ 
  opacity: 0;    
  animation: fade-in 7s ease 5.6s;
  -webkit-animation: fade-in 7s ease 5.6s;
  -moz-animation: fade-in 7s ease 5.6s;
  -o-animation: fade-in 7s ease 5.6s;
  -ms-animation: fade-in 7s ease 5.6s;
  
  /*规定动画的最后状态为结束状态*/
  animation-fill-mode:forwards;
  -webkit-animation-fill-mode: forwards;  
    -o-animation-fill-mode: forwards; 
    -ms-animation-fill-mode: forwards;   
    -moz-animation-fill-mode: forwards; 
}
/* #endregion 中间正文 end */




/* #region 底部搜索 */
.started {
  width: 100%;
  background: linear-gradient(135deg, #22d7bb 0%, #105CFB 100%);
  padding: 5em 0;
  clear: both;
  margin-bottom: -1px;

}

.started_title {
  margin: 20px 0 50px 0;
}


.started_title h1 {
  position: relative;
  top: 20px;
  opacity: 0;
  text-align: center;
  color: #fff;
  margin-bottom: 20px !important;
  font-size: 36px;
  font-family: "Work Sans", Arial, sans-serif;
  line-height: 1.5;
  font-weight: bold;
}

.started_title p {
  position: relative;
  top: 20px;
  opacity: 0;
  text-align: center;
  color: rgba(255, 255, 255, 0.5);
  font-size: 20px;
  line-height: 1.5;
  margin-bottom: 20px;
}

.started_search {
  margin-left: 16.66667%;
  width: 66.66667%;
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
  margin-bottom: 20px;
}

.started_search form {
  position: relative;
  opacity: 0;
  top: 20px;
}

.started_search form input {
  float: left;
  padding: 10px 20px;
  width: 367px;
  height: 34px;
  margin: 0 15px;
  background: rgba(255, 255, 255, 0.2);
  border: none !important;
  font-size: 16px !important;
  color: #fff !important;
  font-weight: 300;
  border-radius: 4px;
}

.started_search form button {
  float: right;
  height: 54px;
  border: none !important;
  background: #22d7bb;
  color: #fff;
  font-size: 16px;
  font-weight: 400;
  padding: 0 45px;
  margin: 0 19px 4px 15px;
  transition: 0.5s;
  font-family: "Work Sans", Arial, sans-serif;
  border-radius: 30px;
  text-align: center;
  cursor: pointer;
  display: block;
  width: 300px;
}

/* #endregion  */

/*  #region 底部 */
footer {
  background: #2b373d;
  padding: 0px;
  font-family: PingFangSC-Regular;
}

/* 上面部分 */
footer .footer_top {
  padding: 0 14px;
  width: 100%;
  height: 120px;
  border-bottom: 1px solid #414b51;
}

footer .footer_top ul {
  width: 1140px;
  padding-left: 0px;
  margin-bottom: 0px;
}

footer .footer_top ul li {
  float: left;
  width: 25%;
  height: 120px;
  list-style: none;
}

footer .footer_top ul li a {
  white-space: nowrap;
  display: block;
  line-height: 120px;
  padding-left: 95px;
  background-repeat: no-repeat;
  background-position: 28px center;
  font-size: 16px;
  color: #fff;
}
footer .footer_top ul li:nth-child(1) a{
  background-image: url('../images/zlg/bottom_07.png')
}
footer .footer_top ul li:nth-child(2) a{
  background-image: url('../images/zlg/bottom_09.png')
}
footer .footer_top ul li:nth-child(3) a{
  background-image: url('../images/zlg/bottom_03.png')
}
footer .footer_top ul li:nth-child(4) a{
  background-image: url('../images/zlg/bottom_05.png')
}


/* 中间部分 */
.footer_middle {
  padding: 0 14px;
  width: 1140px;
  margin: 40px 0 40px 20px;
}

.footer_left {
  width: 344px;
  float: left;
}

.footer_left h1 img {
  width: 140px;
  height: 40px;
}

.footer_left p {
  margin-top: 17px;
  line-height: 25px;
  font-size: 14px;
  color: #fff;
}

.footer_left ul {
  width: 100%;
  margin-top: 20px;
}

.footer_left ul li {
  float: left;
  margin-right: 15px;
  width: 40px;
  height: 40px;
}

.footer_left ul li a {
  display: block;
}

.footer_left ul li i {
  display: inline-block;
  width: 40px;
  height: 40px;
  background-repeat: no-repeat;
  background-position: center;
}

.footer_left ul li:nth-child(1) i {
  background-image: url('../images/zlg/bottom_23.png')
}

.footer_left ul li:nth-child(1) i:hover {
  background-image: url('../images/zlg/bottom_23_hover.png')
}

.footer_left ul li:nth-child(2) i {
  background-image: url('../images/zlg/bottom_25.png')
}

.footer_left ul li:nth-child(2) i:hover {
  background-image: url('../images/zlg/bottom_25_hover.png')
}

.footer_left ul li:nth-child(3) i {
  background-image: url('../images/zlg/bottom_27.png')
}

.footer_left ul li:nth-child(3) i:hover {
  background-image: url('../images/zlg/bottom_27_hover.png')
}

.footer_left ul li:nth-child(4) i {
  background-image: url('../images/zlg/bottom_29.png')
}

.footer_left ul li:nth-child(4) i:hover {
  background-image: url('../images/zlg/bottom_29_hover.png')
}

.footer_left ul li:nth-child(1) span {
  position: absolute;
  top: 165px;
  left: -5px;
  background-image: url('../images/zlg/plat_qrcode.png');
  background-repeat: no-repeat;
  background-position: -132px 0;
  display: none;
  width: 132px;
  height: 132px;
  border: 1px solid #ddd;
  background-color: #fff;
}

.footer_left ul li:nth-child(1) span::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0px;
  width: 0;
  height: 0;
  margin-left: -10px;
  bottom: -20px;
  left: 50%;
  border: 10px solid transparent;
  border-top: 10px solid #fff;
}

.footer_left ul li:nth-child(1):hover span {
  display: block;
}

.footer_left ul li:nth-child(2) span {
  position: absolute;
  top: 165px;
  left: 55px;
  background-image: url('../images/zlg/plat_qrcode.png');
  background-repeat: no-repeat;
  background-position: 0 0;
  display: none;
  width: 132px;
  height: 132px;
  border: 1px solid #ddd;
  background-color: #fff;
}

.footer_left ul li:nth-child(2) span::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0px;
  width: 0;
  height: 0;
  margin-left: -10px;
  bottom: -20px;
  left: 50%;
  border: 10px solid transparent;
  border-top: 10px solid #fff;
}

.footer_left ul li:nth-child(2):hover span {
  display: block;
}

.footer_right {
  color: #ffff;
  width: 750px;
  height: 100%;
  border-left: 1px solid #414b51;
  padding-left: 20px;
  float: left;
}

.footer_right dl {
  float: left;
  width: 20%;
  margin-bottom: 10px;
  padding-left: 5%;
}

.footer_right dt {
  font-size: 16px;
  color: #fff;
  line-height: 30px;
  list-style: none;
}

.footer_right dd {
  line-height: 30px;
  list-style: none;
}

.footer_right dd a {
  color: #819199;
  font-size: 14px;
}

.footer_right dd a:hover {
  text-decoration: underline;
  color: #fff;
}
/* 底部 */
.footer_bottom {
  width: 100%;
  border-top: 1px solid #414b51;
  text-align: center;
  padding: 0 0 40px 0;
}

.footer_bottom p {
  text-align: center;
  color: #819199;
  font-size: 12px;
  line-height: 25px;
  margin: 13px 0;
}

.footer_bottom p a {
  color: #819199;
  margin-left: 20px;
}
.footer_bottom p a:hover {
  text-decoration: underline;
}


.gototop {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 999;
  opacity: 1;
  transition: 0.5s;
}

.gototop a {
  position: relative;
  right: -100px;
  width: 50px;
  opacity: 0;
  height: 50px;
  display: table;
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
  text-align: center;
  border-radius: 4px;
}
.gototop a i {
  display: block;
  width: 16px;
  height: 16px;
  background-image: url('../images/zlg/arrow.png');
  background-size: 100%;
  margin: 17px;
}
/*  #endregion 底部 */